﻿@page "/components/breadcrumb"
<Pager Title="Breadcrumb" 
Description="Indicate the current page’s location within a navigational hierarchy that automatically adds separators"
Indicates="@(new[]{"Example","Divider"})"
>
	<Demo Title="Example">
		<Description>
			Use an ordered or unordered list with linked list items to create a minimally styled breadcrumb.
		</Description>
		<Run>
			<Breadcrumb>
				<BreadcrumbItem>Home</BreadcrumbItem>
				<BreadcrumbItem Active>Library</BreadcrumbItem>
			</Breadcrumb>
			
			<Breadcrumb>
				<BreadcrumbItem>Home</BreadcrumbItem>
				<BreadcrumbItem>Library</BreadcrumbItem>
				<BreadcrumbItem Active>Data</BreadcrumbItem>
			</Breadcrumb>
		</Run>
		<Code>
			@MD.Write(@"
```html
<Breadcrumb>
	<BreadcrumbItem>Home</BreadcrumbItem>
	<BreadcrumbItem Active>Library</BreadcrumbItem>
</Breadcrumb>
			
<Breadcrumb>
	<BreadcrumbItem>Home</BreadcrumbItem>
	<BreadcrumbItem>Library</BreadcrumbItem>
	<BreadcrumbItem Active>Data</BreadcrumbItem>
</Breadcrumb>
```
			")
		</Code>
	</Demo>
		<Demo Title="Divider">
		<Description>
		</Description>
		<Run>			
			<Breadcrumb Divider=">">
				<BreadcrumbItem>Home</BreadcrumbItem>
				<BreadcrumbItem>Library</BreadcrumbItem>
				<BreadcrumbItem Active>Data</BreadcrumbItem>
			</Breadcrumb>
		</Run>
		<Code>
			@MD.Write(@"
```html
<Breadcrumb Divider="">"">
	<BreadcrumbItem>Home</BreadcrumbItem>
	<BreadcrumbItem>Library</BreadcrumbItem>
	<BreadcrumbItem Active>Data</BreadcrumbItem>
</Breadcrumb>
```
			")
		</Code>
	</Demo>
</Pager>